@extends('user.base_sections')
@section('title', '题库中心')
@section('content')
    <div class="layui-container">
        <div class="layui-row" >
            <div class="layui-col-md3  dhbwl-bg-white" style="">
                <div class="dhbwl-anwser-tab" id="dhbwl-anwser-tab">
                    <div class="layui-card-body dhbwl-bg-blue">
                        答题卡
                    </div>
                    <div class="dhbwl-question-tab">
                        <ul>
                            @for($i=1;$i<count($question)+1;$i++)
                                <a href="#question{{$i}}" class="layui-btn dhbwl-bg-blue">{{$i}}</a>
                            @endfor
                        </ul>
                    </div>
                    <div class="layui-card-body ">
                        {{$question->onEachSide(100)->links('user.question_page') }}
                    </div></div>

            </div>
<div class="layui-col-md9" style="padding: 0 0 0 15px">
    <div class="layui-row">
        <div class="layui-col-md12 dhbwl-bg-white">
            <div class="layui-btn-container dhbwl-question-type">
                <a href="{{route('user.question.show',['section' => $section])}}" class="layui-btn dhbwl-bg-blue">全部题型</a>
                <a href="{{route('user.question.show',['section' => $section,'type' => '1'])}}" class="layui-btn dhbwl-bg-blue">单选题</a>
                <a href="{{route('user.question.show',['section' => $section,'type' => '2'])}}" class="layui-btn dhbwl-bg-blue">多选题</a>
                <a href="{{route('user.question.show',['section' => $section,'type' => '3'])}}" class="layui-btn dhbwl-bg-blue">判断题</a>
                <a href="{{route('user.question.index')}}" class="layui-btn layui-bg-red" style="float: right"><i class="layui-icon" style="margin-right: 10px">&#xe65c;</i>返回</a>
            </div>

        </div>

    </div>
    <form class="layui-form">
        @foreach($question as $k=>$val)
    <div class="layui-row layui-col-space15" id="question{{$k+1}}">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="dhbwl-card-header">
                    <span class="layui-badge-dot"></span>  第{{$k+1}}题【{{$val->type_name}}】
                    <a onclick="favors('{{$val->id}}')" class="layui-btn layui-btn-sm dhbwl-bg-blue"><i class="layui-icon">&#xe600;</i>收藏</a>
                    <a onclick="errors('{{$val->id}}','{{$section}}')" class="layui-btn layui-btn-sm layui-btn-warm"><i class="layui-icon">&#xe642;</i>纠错</a>
                    <a class="layui-btn layui-btn-sm layui-btn-danger" id="showanwser{{$k+1}}" onclick="showanwser('{{$k+1}}')">查看答案</a>
                    <div class="layui-clear"></div>
                </div>
                <div class="layui-card-body">
                    <div class="dhbwl-question-title">
                        {{$val->question}}
                    </div>
                    @foreach($val->select_array as $num=>$question)
                        <div class="dhbwl-question-select">
                            <input type="radio" lay-filter="radio" name="sex" value="{{chr($num+65)}}" title="{{chr($num+65)}}">
                            <div class="layui-inline">
                                <div class="layui-form-mid layui-word-aux">{{$question}}</div>
                            </div>
                        </div>

                    @endforeach




                    <div class="anwser"><div class="dhbwl-card-btn">
                            <a  onclick="showanwser('{{$k+1}}')" class="layui-btn layui-btn-sm dhbwl-bg-blue"><i class="layui-icon">&#xe619;</i>查看答案</a>
                        </div>
                        <div class="dhbwl-question-text" id="anwser{{$k+1}}" style="display: none">
                            <p>参考答案： <span class="layui-badge layui-bg-orange">{{$val->answer}} </span></p>
                            <p>问题编号： <span class="layui-badge layui-bg-orange">{{$val->id}}</span></p>
                            <p>答案解析：{{$val->intro}} </p>
                        </div></div>


                </div>

            </div>
        </div>


    </div>@endforeach </form>


            <!--习题集方块结束-->



        </div>
    </div>
</div>
@include('user._footer')
<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/user.js"></script>
<script src="/static/js/layui/layui.all.js"></script>
    <script>
        layui.use('form', function(){
            var form = layui.form;
            form.on('radio(radio)', function(data){
                console.log(data.elem); //得到radio原始DOM对象
                console.log(data.value); //被点击的radio的value值
            });

            //各种基于事件的操作，下面会有进一步介绍
        });
        function favors(id) {
            layer.msg('确定要收藏本题？', {
                time: 0, //20s后自动关闭
                btn: ['确定', '取消'],
                yes:function () {
                    var loading = layer.load(0, {shade: false, time: 2 * 1000});
                    $.ajax({
                        type: 'post',
                        url: '{{route('user.favors.store')}}',
                        data: {
                            'question': id,
                            '_token': '{{csrf_token()}}',
                            'section':'{{$section}}'
                        },
                        dataType: 'json',
                        success: function (data) {
                            layer.close(loading);
                            if (data == 1) {
                                layer.alert('收藏成功', {
                                    icon: 1,
                                    skin: 'layui-layer-molv' //样式类名
                                    , closeBtn: 0
                                });
                            } else {
                                layer.alert('收藏重复', {
                                    icon: 2,
                                    skin: 'layui-layer-molv' //样式类名
                                    , closeBtn: 0
                                });
                            }
                        }, error: function (res) {
                            layer.alert('请求失败，请联系管理员', {
                                icon: 2,
                                title: '提示信息',
                                skin: 'layui-layer-molv' //样式类名
                                , closeBtn: 0
                            });
                        }
                    });

                }
            });
        }
        function errors(id,section) {
            layer.open({
                type: 2,
                title: '纠错',
                shadeClose: true,
                shade: 0.8,
                area: ['500px', '40%'],
                content: '{{route('user.question.errors')}}?question='+ id +'&section='+ section //iframe的url
            });

        }
    </script>
@endsection
